$(document).ready(function() {
    
    makeSectionsHideable();
    
    //add file input listeners
    //document.getElementById("file_sequence").addEventListener("change", handle_sequence_file);
    //document.getElementById("file_mutations").addEventListener("change", handle_sequence_file);
 });
 
 function makeSectionsHideable() {
     // add arrow and hide function to alignment
   $(".above_hideable").addClass("arrow_down");
   
   //hide all hideable items
   $(".hideable").hide();
   
   //add hide and show function to the hideable items
   //and change arrow on the according .above_hideable item
   $(".above_hideable").click(function () {
      $(this).next(".hideable").toggle(100, function() {
          var h2 = $(this).prev(".above_hideable");
          if (h2.hasClass("arrow_up")) {
              h2.removeClass("arrow_up");
              h2.addClass("arrow_down");
          } else {
              h2.removeClass("arrow_down");
              h2.addClass("arrow_up");
          }
      });
    });
 }

function handle_sequence_file(event) {
    var file = event.target.files[0];
    var reader = new FileReader();
    reader.onload = (function(file) {
        return function(e) {
            var contents = e.target.result;
            if (event.target.id === "file_sequence") {
                document.getElementById("sequence_area").value = contents;
            } else if (event.target.id === "file_mutations") {
                document.getElementById("mutations").value = contents;
            }
        };
    })(file);
    reader.readAsText(file);
}